import styled, { createGlobalStyle } from 'styled-components'
export const THeaderWrap = styled.div`
	display: flex;
	height: 28px;
	align-items: center;
	> div {
		/* flex: 1; */
		position: relative;
		color: #8b8b8b;
		box-sizing: border-box;
		transition: width cubic-bezier(0.445, 0.05, 0.55, 0.95);
	}
	.name-column {
		span {
			padding-left: 26px;
		}
	}
	.action-column,
	.status-column {
		position: relative;
		span {
			padding-left: 4px;
		}
		b {
			position: absolute;
			height: 16px;
			top: 2px;
			left: 0;
			width: 6px;
			border-left: 1px solid darkgray;
			cursor: col-resize;
			z-index: 8;
		}
		.border-b-line {
			position: absolute;
			left: 0;
			width: 1px;
			background: #ccc;
			z-index: 5;
			height: 9999px;
			cursor: col-resize;
		}
	}
`
export const DragGlobal = createGlobalStyle`
	body{
		user-select: none;
		cursor: col-resize;
	}
`
